<template>
	<view>
		<!-- 会议查询 -->
		<view>
			<uni-search-bar bgColor="#778899" @clear="clear" :maxlength=10 @cancel="cancel" radius=20
				placeholder="请输入会议主题" @confirm="doSearch" />
		</view>
		<view>
			<scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y">
				<!-- 我的会议展示 -->
				<view @click="toMeetDetail(item.id)" v-for="(item,index) in data" :key="index">
					<uni-card style="height: auto;">
						<view style="display: flex;">
							<view>
								<uni-section titleColor="#0081ff" :title="item.theme" type="square"></uni-section>
								<view><text style="color: #f37b1d;" class="Text">时间：{{item.beginTime}}</text></view>
								<view><text style="color: #8dc63f;" class="Text">会议室：{{item.roomName}}</text></view>
								<view><text style="color: #1cbbb4;" class="Text">发起人：{{item.authorPhone}}</text></view>
								<view><text style="color: #6739b6;" class="Text">时长：{{item.meetLength}}分钟</text></view>
								<view><text style="color: #a5673f;" class="Text">备注：{{item.remark}}</text></view>

							</view>
							<view style=" display: flex; margin-left: 50px;">
								<view style=" margin-top: 65px;"><text style="color: #9c26b0;">{{item.status}}</text>
								</view>
								<view style="margin-top: 65px;"><uni-icons color="#9c26b0" type="right"
										size="20"></uni-icons>
								</view>
							</view>
						</view>
					</uni-card>
				</view>
				<view v-if="flag">
					<view style="margin-top: 40px;margin-left: 140px">
						<image style="width: 100px; height: 100px;" src="@/static/icons/nodata.png"></image>
					</view>
				</view>
			</scroll-view>
		</view>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue';
	import {
		onLoad,
		onPullDownRefresh
	} from '@dcloudio/uni-app';
	import {
		getList,
		searchRecord
	} from '@/api/reservation.js';
	import {share} from '@/utils/share.js';
	onLoad(() => {
		share();
		getReservationMeeting();
	});
	const flag = ref(false);
	const data = ref([]);
	//获取登录用户的预约会议
	async function getReservationMeeting() {
		const userInfo = uni.getStorageSync('user');
		await getList(userInfo.phone).then(res => {
			if (res.code === 200) {
				data.value = res.data;
				if (data.value === null) {
					flag.value = true;
				}
				if (data.value.length === 0) {
					flag.value = true;
				}
			}
		});
	};

	//根据会议主题搜索
	function doSearch(e) {
		searchRecord(e.value).then(res => {
			if (res.code === 200) {
				data.value = res.data;
				if (data.value.length === 0) {
					flag.value = true;
				}
			}
		})
	};

	function clear() {
		getReservationMeeting();
		flag.value = false;
	};

	function cancel() {
		getReservationMeeting();
		flag.value = false;
	};

	//下拉刷新请求数据
	onPullDownRefresh(() => {
		getReservationMeeting();
		setTimeout(() => {
			uni.stopPullDownRefresh();
		}, 500);
	});

	//转去会议详情页
	function toMeetDetail(id) {
		uni.navigateTo({
			url: '/pages/meetDetail/meetDetail?id=' + id
		})
	};
	const scrollTop = ref(0);
</script>

<style scoped lang="scss">
	.Text {
		font-size: 13px;
	}

	.scroll-Y {
		height: 540px;
	}
</style>